﻿<%@ Page Title="" Language="C#" MasterPageFile="~/MainMaster.Master" AutoEventWireup="true"
    CodeBehind="EasyShowTable.aspx.cs" Inherits="EasyUI.Controls.ShowDataTable" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
    <title>ShowDataTable Control</title>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    <div class="controlHeader">
        ShowDataTable Control</div>
    <div>
        <div class="controlDemo">
            <span>Demo:</span>
            <table class="easyShowTable" width="72%">
                <thead>
                    <tr>
                        <th>
                            Id
                        </th>
                        <th>
                            Name
                        </th>
                        <th>
                            Description
                        </th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td>
                            001
                        </td>
                        <td>
                            a
                        </td>
                        <td>
                         2009/01/14
                        </td>
                    </tr>
                    <tr>
                        <td>
                            002
                        </td>
                        <td>
                            b
                        </td>
                        <td>
                        2009/10/10
                        </td>
                    </tr>
                    <tr>
                        <td>
                            003
                        </td>
                        <td>
                            c
                        </td>
                        <td>
                            2009/10/11
                        </td>
                    </tr>
                </tbody>
            </table>
            <br />
            <div>
             <table class="easyShowTable easyTableFooter" style="width: 55.5%;margin:0px;">
                <thead>
                    <tr>
                        <th>
                            Id
                        </th>
                        <th>
                            Name
                        </th>
                        <th>
                            Description
                        </th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td>
                            001
                        </td>
                        <td>
                            a
                        </td>
                        <td>
                         2009/01/14
                        </td>
                    </tr>
                    <tr>
                        <td>
                            002
                        </td>
                        <td>
                            b
                        </td>
                        <td>
                        2009/10/10
                        </td>
                    </tr>
                    <tr>
                        <td>
                            003
                        </td>
                        <td>
                            c
                        </td>
                        <td>
                            2009/10/11
                        </td>
                    </tr>
                                <tr>
                        <td>
                            001
                        </td>
                        <td>
                            a
                        </td>
                        <td>
                         2009/01/14
                        </td>
                    </tr>
                    <tr>
                        <td>
                            002
                        </td>
                        <td>
                            b
                        </td>
                        <td>
                        2009/10/10
                        </td>
                    </tr>
                    <tr>
                        <td>
                            003
                        </td>
                        <td>
                            c
                        </td>
                        <td>
                            2009/10/11
                        </td>
                    </tr>
                                <tr>
                        <td>
                            001
                        </td>
                        <td>
                            a
                        </td>
                        <td>
                         2009/01/14
                        </td>
                    </tr>
                    <tr>
                        <td>
                            002
                        </td>
                        <td>
                            b
                        </td>
                        <td>
                        2009/10/10
                        </td>
                    </tr>
                    <tr>
                        <td>
                            003
                        </td>
                        <td>
                            c
                        </td>
                        <td>
                            2009/10/11
                        </td>
                    </tr>
                                <tr>
                        <td>
                            001
                        </td>
                        <td>
                            a
                        </td>
                        <td>
                         2009/01/14
                        </td>
                    </tr>
                    <tr>
                        <td>
                            002
                        </td>
                        <td>
                            b
                        </td>
                        <td>
                        2009/10/10
                        </td>
                    </tr>
                    <tr>
                        <td>
                            003
                        </td>
                        <td>
                            c
                        </td>
                        <td>
                            2009/10/11
                        </td>
                    </tr>
                                <tr>
                        <td>
                            001
                        </td>
                        <td>
                            a
                        </td>
                        <td>
                         2009/01/14
                        </td>
                    </tr>
                    <tr>
                        <td>
                            002
                        </td>
                        <td>
                            b
                        </td>
                        <td>
                        2009/10/10
                        </td>
                    </tr>
                    <tr>
                        <td>
                            003
                        </td>
                        <td>
                            c
                        </td>
                        <td>
                            2009/10/11
                        </td>
                    </tr>
                                <tr>
                        <td>
                            001
                        </td>
                        <td>
                            a
                        </td>
                        <td>
                         2009/01/14
                        </td>
                    </tr>
                    <tr>
                        <td>
                            002
                        </td>
                        <td>
                            b
                        </td>
                        <td>
                        2009/10/10
                        </td>
                    </tr>
                    <tr>
                        <td>
                            003
                        </td>
                        <td>
                            c
                        </td>
                        <td>
                            2009/10/11
                        </td>
                    </tr>
                </tbody>
            </table>
            </div>
        </div>
        <div class="controlDemo">
            <span>Source Code: </span>
                 <script type="syntaxhighlighter" class="brush:html"><![CDATA[   
                     <table class="easyShowTable">
                        <thead>
                            <tr>
                                <th>...</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr>
                                <td>...</td>
                            </tr>
                        </tbody>
                     </table>
                 ]]></script>
        </div>
        <div class="controlDemo">
            <span>How to use:</span>
            <ol>
                <li>Add base files to your page: reset.css; core.css; core.js. <a href='#'>[DownLoad]</a>
                </li>
                <li>Apply class [easyShowTable] to your table tag</li>
                <li>If table footer required,apply class [easyTableFooter] to your table tag</li>
            </ol>
        </div>
        <div class="controlDemo">
            <span>Note</span>
            <ol>
                <li>Base on JQuery <a href='#'>[DownLoad]</a></li>
                <li>Browser: IE7.0+; Fiefox2.0+; Opera9.0+</li>
                <li>OS: Windows; Mac; Linux</li>
            </ol>
        </div>
    </div>
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="ScriptPlaceHolder" runat="server">
</asp:Content>
